<template>
	<my-select
		size="small"
		placeholder="搜索组件"
		:list="List"
		:fileType="{ label: 'title', value: 'name' }"
		@change="selectChartHandle"
	/>
</template>

<script setup>
import { addEdit } from '@/views/chart/hooks/component.hook';

const props = defineProps({
	menuOptions: {
		type: Array,
		default: () => []
	}
});

// 搜索处理 List-组件列表
const List = computed(() => {
	const arr = [];
	for (const item of props.menuOptions) {
		arr.push(...item.list);
	}
	return arr;
});

// 选择处理
async function selectChartHandle(val) {
	let data = List.value.filter((item) => item.name === val)[0];
	if (data?.disabled) return;
	try {
		loadingStart();
		// 添加编辑区组件
		addEdit(data);
		loadingFinish();
	} catch (error) {
		loadingError();
		msgWarning(`图表正在研发中, 敬请期待...`);
	}
}
</script>
